<!--
**********************************************************
* @Author: 张小平
* @Date:   2024-05-01
* @Email:  qqshuqian@163.com
* @Last modified: 最后修改日期
* @Description: 文件描述
**********************************************************
-->
<template>
  <div>
    <a
      :href="generateUrl ? generateUrl : '#'"
      v-if="column.targetType === '_blank'"
      target="_blank"
      style="color: #409eff"
      >{{ column.title ? column.title : column.label }}</a
    >
    <a href="#" v-else style="color: #409eff" @click="openWindow">{{ column.title ? column.title : column.label }}</a>
    <el-dialog
      :title="column.title ? column.title : column.label"
      v-model="centerDialogVisible"
      :width="this.column.fullscreen !== 'true' ? column.width : ''"
      :append-to-body="true"
      :fullscreen="this.column.fullscreen === 'true'"
    >
      <iframe :src="generateUrl ? generateUrl : '#'" class="iframe" ref="iframe" :height="height"></iframe>
      <span slot="footer" class="dialog-footer" v-if="column.confirmName || column.cancelName">
        <el-button @click="centerDialogVisible = false" v-if="column.cancelName">{{ column.cancelName }}</el-button>
        <el-button type="primary" @click="centerDialogVisible = false" v-if="column.confirmName">{{
          column.confirmName
        }}</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  name: 'AvueHyperLink',
  inject: ['viewFormData'],
  props: ['column'],
  data() {
    return {
      centerDialogVisible: false,
      height: 500
    }
  },
  mounted() {
    if (this.column.targetType === 'dialog' && this.column.fullscreen === 'true') {
      this.height = (document.documentElement.clientHeight * 75) / 100
    } else if (this.column.targetType === 'dialog' && this.column.height.indexOf('%') >= 0) {
      this.height = (parseInt(this.column.height.replace('%', '')) * document.documentElement.clientHeight) / 100
    } else if (this.column.targetType === 'dialog') {
      this.height = this.column.height
    }
  },
  computed: {
    generateUrl() {
      if (!this.viewFormData || !this.viewFormData.modelData) {
        return
      }
      let url = this.column.value
      let replaceKey = url.match(/\${.*?}/g)
      if (Array.isArray(replaceKey) && replaceKey.length) {
        replaceKey.forEach((item) => {
          let propKey = item.substring(2, item.length - 1)
          url = url.replace(item, `${this.viewFormData.modelData[propKey]}`)
        })
      }
      return url
    }
  },
  methods: {
    openWindow() {
      this.centerDialogVisible = true
    },
    closeWindow() {
      this.centerDialogVisible = false
    }
  },
  created() {
    var _this = this
    window.closeWindow = function () {
      _this.centerDialogVisible = false
    }
  }
}
</script>
 <style lang="scss">
.iframe {
  width: 100%;
  border: 0;
  overflow: hidden;
  box-sizing: border-box;
}
</style>
